<template>
	<view class="u-p-30">
		<view class="combox u-p-20">
			<view class="u-flex u-flex-between u-border-bottom u-p-t-20 u-p-b-25">
				<view>
					头像
				</view>
				<view class="u-wd-40 u-he-40">
					<button class="u-reset-button" open-type="chooseAvatar" @chooseavatar="onChooseAvatar" slot="right">
						<image class="u-wd-40 u-he-40" :src="avatar?avatar:require('@/static/images/moren.png')">
						</image>
					</button>
				</view>
			</view>
			<view class="u-flex u-flex-between u-border-bottom u-p-t-20 u-p-b-25">
				<view>
					昵称
				</view>
				<view>
					<input type="text" v-model="nickName" placeholder="请输入昵称" style="text-align: right;" />
				</view>
			</view>
			<view class="u-flex u-flex-between  u-p-t-20 u-p-b-25" @click="handle">
				<view>
					手机号
				</view>
				<view class="u-flex u-flex-y-center">
					{{phone | ''}}<u-icon name='arrow-right'></u-icon>
				</view>
			</view>
		</view>
		<u-button type="primary" text="提交" customStyle="margin-top: 50px" @click="submit"></u-button>
	</view>
</template>

<script>
	import url from '@/config/url.js';

	export default {
		data() {
			return {
				avatar: "",
				nickName: '', // 用于存储昵称
				phone: "",
				uploadUrl: url.upload,
			}
		},
		onShow() {
			let wxUser = uni.getStorageSync("identity").wxUser;
			if (wxUser.avatarUrl != '') {
				this.avatar = wxUser.avatarUrl
			}
			if (wxUser.nickName != '') {
				this.nickName = wxUser.nickName

			}
			this.phone = uni.getStorageSync("phone");
		},
		methods: {
			handle() {
				uni.$u.route("/pages/my/phone");
			},
			onChooseAvatar(e) {
				uni.uploadFile({
					url: this.uploadUrl, //上传的路径
					filePath: e.detail.avatarUrl, //刚刚在data保存的文件路径
					name: 'file', //后台获取的凭据
					header: {
						Authorization: "Bearer " + uni.getStorageSync('token')
					},
					success: uploadFileRes => {
						// 注意：这里返回的uploadFileRes.data 为JSON 需要自己去转换
						let data = JSON.parse(uploadFileRes.data);
						if (data.code === 200) {
							this.avatarUrl = data.data.ossUrl;
							this.$api.setAvatarUrlApi({
								avatarUrl: this.avatarUrl
							}).then(res => {
								if (res.code == 200) {
									// uni.showToast({
									// 	title: '修改成功',
									// 	duration: 2000
									// });
									console.log(res)
								}
							})
						}
					},
					fail: (error) => {
						// uni.showToast({
						// 	title: error,
						// 	duration: 2000
						// });
					},
					complete: () => {

					}
				});



				// this.$api.setAvatarUrlApi({
				// 	avatarUrl: e.detail.avatarUrl
				// }).then(res => {
				// 	this.avatar = e.detail.avatarUrl;
				// })
			},
			submit() {
				this.$api.setNickNameApi({
					nickName: this.nickName
				}).then(res => {
					uni.$u.toast('信息提交成功');
					setTimeout(() => {
						uni.navigateBack()
					}, 1000)
				})
			}


		}
	}
</script>

<style>
</style>